﻿<!DOCTYPE html>
<html>
<head>
    <title>SSE示例</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link type="text/css" href="/js/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <link type="text/css" href="/js/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet" />
    <link type="text/css" href="/js/window/window.css" rel="stylesheet" />

    <script src="/js/jquery-1.7.1.min.js"></script>
    <script src="/js/window/window.js"></script>

    <script type="text/javascript">
        // 事件订阅
        var es = new EventSource("/event/source");
        es.onmessage = function (e) {
            win.alert('新文章通知', e.data);
        }

        function save(dom) {
            var article = $(dom).prev().val();
            $.post("/event/index", { article: article });
        }
    </script>

    <style type="text/css">
        body { padding: 10px; }
    </style>
</head>

<body>
    <div><span class="label label-info">场景假设</span></div>
    <p>用户A在浏览器上发表了文章，服务器直接将文章推送给所有在线的浏览器用户，你得浏览器多开此页面才能体现效果</p>

    <div><span class="label label-info">发表文章</span></div>
    <textarea style="resize: none; height: 40px;">奶茶妹真的怀了 ..</textarea>
    <button class="btn btn-small" onclick="save(this);">提交文章</button>


    <div><span class="label label-info">服务器代码</span></div>
    <div class="cnblogs_code">
        <pre><span style="color: #808080;">        ///</span> <span style="color: #808080;">&lt;summary&gt;</span>
        <span style="color: #808080;">///</span><span style="color: #008000;"> 服务器事件订阅
        </span><span style="color: #808080;">///</span> <span style="color: #808080;">&lt;/summary&gt;</span>
        <span style="color: #808080;">///</span> <span style="color: #808080;">&lt;returns&gt;&lt;/returns&gt;</span>
        <span style="color: #0000ff;">public</span><span style="color: #000000;"> ActionResult Index()
        {
            </span><span style="color: #0000ff;">return</span><span style="color: #000000;"> View();
        }

        </span><span style="color: #808080;">///</span> <span style="color: #808080;">&lt;summary&gt;</span>
        <span style="color: #808080;">///</span><span style="color: #008000;"> 用户提交了文章
        </span><span style="color: #808080;">///</span> <span style="color: #808080;">&lt;/summary&gt;</span>
        <span style="color: #808080;">///</span> <span style="color: #808080;">&lt;param name="article"&gt;&lt;/param&gt;</span>
        <span style="color: #808080;">///</span> <span style="color: #808080;">&lt;returns&gt;&lt;/returns&gt;</span>
<span style="color: #000000;">        [HttpPost]
        </span><span style="color: #0000ff;">public</span> ActionResult Index(<span style="color: #0000ff;">string</span><span style="color: #000000;"> article)
        {
            </span><span style="color: #0000ff;">var</span> httpEvent = <span style="color: #0000ff;">new</span> HttpEvent { Data =<span style="color: #000000;"> article };
            </span><span style="color: #0000ff;">this</span><span style="color: #000000;">.CurrentContext
                .EventSession
                .ToList()
                .ForEach(item </span>=&gt;<span style="color: #000000;"> item.SendEvent(httpEvent));

            </span><span style="color: #0000ff;">return</span> Json(<span style="color: #800000;">"</span><span style="color: #800000;">你的文章已推荐给所有人</span><span style="color: #800000;">"</span><span style="color: #000000;">);
        }

        </span><span style="color: #808080;">///</span> <span style="color: #808080;">&lt;summary&gt;</span>
        <span style="color: #808080;">///</span><span style="color: #008000;"> SSE请求
        </span><span style="color: #808080;">///</span> <span style="color: #808080;">&lt;/summary&gt;</span>
        <span style="color: #808080;">///</span> <span style="color: #808080;">&lt;returns&gt;&lt;/returns&gt;</span>
        <span style="color: #0000ff;">public</span><span style="color: #000000;"> ActionResult Source()
        {
            </span><span style="color: #0000ff;">if</span> (Request.IsEventStreamRequest() == <span style="color: #0000ff;">true</span><span style="color: #000000;">)
            {
                </span><span style="color: #0000ff;">return</span> <span style="color: #0000ff;">new</span><span style="color: #000000;"> EventResult();
            }
            </span><span style="color: #0000ff;">return</span> <span style="color: #0000ff;">new</span><span style="color: #000000;"> EmptyResult();
        }</span></pre>
    </div>
    <p>&nbsp;</p>


    <div><span class="label label-info">javascript</span></div>
    <div class="cnblogs_code">
        <pre><span style="color: #0000ff;">var</span> es = <span style="color: #0000ff;">new</span> EventSource("/event/source"<span style="color: #000000;">);
es.onmessage </span>= <span style="color: #0000ff;">function</span><span style="color: #000000;"> (e) {
    win.alert(</span>'新文章通知'<span style="color: #000000;">, e.data);
}</span></pre>
    </div>
    <p>&nbsp;</p>
</body>
</html>
